<include file="./Application/Home/View/Home/top.html"/>
<div class="contain">
    <div class="operBox">
        <button class="layui-btn layui-btn-small layui-btn-normal c_bgblue" id="add">
            <i class="layui-icon"></i>增加
        </button>
        <button class="layui-btn layui-btn-small layui-btn-normal c_bgblue">
            <i class="layui-icon"></i> 删除
        </button>
    </div>
</div>
<div class="contain layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="50"/>
            <col width="150"/>
            <col width="200"/>
            <col width="200"/>
            <col width="200"/>
            <col/>
            <col/>
            <col width="150"/>
        </colgroup>
        <thead>
        <tr>
            <th><input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose"/></th>
            <th class="text_c">姓名</th>
            <th class="text_c">治疗时间</th>
            <th class="text_c">治疗项目</th>
            <th class="text_c">治疗次数</th>
            <th class="text_c">单价</th>
            <th class="text_c">总价</th>
            <th class="text_c">操作</th>
        </tr>
        </thead>
        <tbody>
        <volist name="list" id="data">
            <tr>
                <td><input type="checkbox" name="" lay-skin="primary"/></td>
                <td class="text_c"><a href="{:U('Home/Home/memberDetails?memberId='.$data['pid'])}">{$data.name}</a></td>
                <td class="text_c">{$data.time}</td>
                <td class="text_c">{$data.xname}</td>
                <td class="text_c">{$data.cishu}</td>
                <td class="text_c">{$data.xprice}</td>
                <td class="text_c">{$data['xprice'] * $data['cishu']}</td>
                <td class="text_c">
                    <a href="javascript:;" _id="{$data.operaid}">修改</a>
                    <a href="{:U('Home/Home/deleteOpera?deleteId='.$data['operaid'])}" _id="{$data.operaid}"
                       _name="delete">删除</a>
                </td>
            </tr>
        </volist>
        </tbody>
    </table>
    <div class="layui-laypage">{$page}</div>
</div>
<div class="layui-layer layui-layer-dialog layer-anim l_pipbox" id="layuiPip" type="dialog" contype="string"
     style="z-index: 100000;">
    <form class="layui-form" action="{:U('Home/Home/addOperation')}" method="post">
        <div class="layui-layer-title">
            添加治疗信息
        </div>
        <span class="layui-layer-setwin"> <a class="layui-layer-ico layui-layer-close layui-layer-close1"
                                             href="javascript:;" id="close"></a> </span>
        <div class="layui-layer-content layui-layer-padding"
             style="padding: 10px 0;overflow: inherit">
            <div class="pipLeft">
                <div class="layui-inline">
                    <label class="layui-form-label">姓名</label>
                    <div class="layui-input-inline">
                        <select name="username" required lay-verify="required" lay-search="">
                            <option value="">直接选择或搜索选择</option>
                            <volist name="users" id="data">
                                <option value="{$data.id}">{$data.name}</option>
                            </volist>
                        </select>
                    </div>
                </div>

            </div>
            <div class="pipRight">

                <div class="layui-inline">
                    <label class="layui-form-label">治疗时间</label>
                    <div class="layui-input-inline">
                        <input class="layui-input" required lay-verify="required" placeholder="点击选择时间" name="operaTime"
                               onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm'})">
                    </div>
                </div>


            </div>
        </div>
        <dl class="searchBox">
            <dt>治疗项目</dt>
            <dd>
                <volist name="items" id="data">
                    <input type="checkbox" _id="{$data.id}" title="{$data.xname}" lay-skin="primary">
                </volist>
            </dd>
        </dl>
        <dl class="searchBox" id="resBox">
            <dt>治疗次数</dt>
            <dd id="choiceBox"></dd>
        </dl>
        <div class="btnBox">
            <a href="javascript:;" class="layui-btn" id="operaSubmit">保存</a>
        </div>
    </form>
</div>
<script src="__PUBLIC__/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="__PUBLIC__/js/jquery.js"></script>
<script>

    //初始化时间
    layui.use('laydate');
    //初始化复选框
    layui.use('form', function () {
        var $ = layui.jquery, form = layui.form();
        form.on('checkbox(allChoose)', function (data) {
            var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]');
            child.each(function (index, item) {
                item.checked = data.elem.checked;
            });
            form.render('checkbox');
        });

    });

    //删除当前数据
    $('[_name="delete"]').click(function () {
        if (confirm('确定删除当前数据吗？')) {
            return true;
        } else {
            return false;
        }

    })

    //多选加入次数
    $('.layui-form-checkbox').live('click',function () {
        var df = $(this).hasClass('layui-form-checked');
        var _id = $(this).prev('input').attr('_id');
        var xname = $(this).find('span').html();
        if(df){
            $('#resBox dd').append(`
                <p class="line" itemid="${_id}">
                    <span>${xname}</span>
                    <input type="text" value="1">
                </p>
            `);
        }else{
            $('[itemid="'+_id+'"]').remove();
        }
    });
    
    //提交次数
    $('#operaSubmit').live('click',function () {
        if($('#choiceBox').html() == ''){
            alert('请至少选择一项数据！')
        }else{
            var pid = $('.layui-anim .layui-this').attr('lay-value');
            var time = $('[name="operaTime"]').val();
            var itemArray = [];
            var len = $('#choiceBox p').length;
            for(var i = 0; i < len; i++){
                itemArray.push(
                    {
                        'itemid':$('#choiceBox p').eq(i).attr('itemid'),
                        'cishu':$('#choiceBox p').eq(i).find('input').val()
                    }
                )
            }
            //封装好要上传的数据
            var getData = {
                'pid':pid,
                'time':time,
                'itemArray':itemArray
            }

            //ajax上传数据
            $.post('{:U("Home/Home/addOperation")}',{'data':getData}).success(function (res) {
                if(res == 1){
                    location.reload();
                }
            })
        }
    })

    //点击增加案件
    $('#add').click(function () {
        $('.l_pipbox').show();
        initPip();
    });

    //点击关闭弹窗
    $('#close').click(function () {
        $('.l_pipbox').hide();
    });

    initPip();

    $(window).resize(function () {
        initPip();
    })

    //初始化弹窗位置
    function initPip() {
        var pipWid = $('.l_pipbox').outerWidth(),
            windowW = $(window).width(),
            windowH = $(window).height(),
            pipHei = $('.l_pipbox').outerHeight();
        $('.l_pipbox').css({
            'top': ( windowH - pipHei ) / 2,
            'left': ( windowW - pipWid ) / 2
        })
    }

</script>